<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/";
%>
<html>
<head>
    <base href="<%=basePath%>">
    <meta charset="UTF-8">
    <link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet"/>

    <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
    <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/commons.js"></script>
    <script>

        $(function () {
            queryAllDicTypeList();

            //添加按钮绑定单击事件
            $("#createDicTypeBtn").on("click", function () {
                window.location.href = "settings/dictionary/type/createDicTypePage.do"
            })


            //给绑定单击事件
            $("#editDicTypeBtn").on("click", function () {
                //获取勾选的input
                let checkedList = $("#tBody input[type='checkbox']:checked");

                //判断勾选的是否只有一个，如果多于一个就不执行
                if (checkedList.size() !== 1) {
                    alert("一次只能修改一个数据字典类型!");
                    return;
                }
                //获取该编码
                var code = $.trim(checkedList.val());

                //发送ajax请求跳转到修改界面
                window.location.href = 'settings/dictionary/type/editDicTypePage.do?code=' + code;
            })

            // 给删除按钮绑定单击事件
            $("#deleteDicTypeBtn").on("click", function () {
                //获取选中的按钮
                let checkedList = $("#tBody input:checked");
                let checkedCount = checkedList.size();
                //判断是否有被选中的，如果没有就提示选择
                if (checkedCount === 0) {
                    alert("请选择需要删除的字典数据类型!")
                }
                //确定是否要删除
                if (confirm("您确定要删除这" + checkedCount + "条数据吗?")) {
                    //拼接要删除的数据
                    let codes = "";
                    $.each(checkedList, function (index,item) {
                        codes += "code=" + $.trim(item.value) + "&";
                    })
                    //将最后一个&符号删除
                    codes = codes.substring(0, codes.length - 1);
                    //发送ajax请求
                    alert(codes)
                    $.ajax({
                        url: "settings/dictionary/type/deleteDicType.do",
                        data: codes,
                        type: "post",
                        success: function (res) {
                            alert("你已经成功删除了" + res.data + "条数据")
                            // window.location.href = "settings/dictionary/type/index.do"
                            queryAllDicTypeList();
                            //将全选按钮的checked赋false
                            $("#chkedAll").prop("checked",false);
                        },
                    });
                } else {
                    alert("您已取消删除该数据");
                }
            })

        })

        /**
         * 获取所有数据字典类型
         */
        function queryAllDicTypeList() {
            $.ajax({
                url: "settings/dictionary/type/getDicTypeList.do",
                type: "get",
                success: function (data) {
                    //创建拼接的字符串
                    var htmlStr = "";
                    $.each(data, function (index, item) {
                        htmlStr += "<tr class=\"active\">";
                        htmlStr += "<td><input type=\"checkbox\" value=\" " + item.code + "\" /></td>";
                        htmlStr += "<td>" + (index + 1) + "</td>";
                        htmlStr += "<td>" + item.code + "</td>";
                        htmlStr += "<td>" + item.name + "</td>";
                        htmlStr += "<td>" + item.description + "</td>";
                        htmlStr += "</tr>";
                    })
                    //将拼接后的字符串添加到tBody中
                    $("#tBody").html(htmlStr)
                }
            })
        }




    </script>

</head>
<body>

<div>
    <div style="position: relative; left: 30px; top: -10px;">
        <div class="page-header">
            <h3>字典类型列表</h3>
        </div>
    </div>
</div>
<div class="btn-toolbar" role="toolbar" style="background-color: #F7F7F7; height: 50px; position: relative;left: 30px;">
    <div class="btn-group" style="position: relative; top: 18%;">
        <button id="createDicTypeBtn" type="button" class="btn btn-primary"><span
                class="glyphicon glyphicon-plus"></span> 创建
        </button>
        <button id="editDicTypeBtn" type="button" class="btn btn-default"><span class="glyphicon glyphicon-edit"></span>
            编辑
        </button>
        <button id="deleteDicTypeBtn" type="button" class="btn btn-danger"><span
                class="glyphicon glyphicon-minus"></span> 删除
        </button>
    </div>
</div>
<div style="position: relative; left: 30px; top: 20px;">
    <table class="table table-hover">
        <thead>
        <tr style="color: #B3B3B3;">
                    <td><input type="checkbox" id="chkedAll"/></td>
            <td>序号</td>
            <td>编码</td>
            <td>名称</td>
            <td>描述</td>
        </tr>
        </thead>
        <tbody id="tBody">

        </tbody>
    </table>
</div>

</body>
</html>